<template>
  <div class="details container">
  	<router-link to="/" class="btn btn-default">返回</router-link>
    <h1 class="page-header">
    	{{customer.name}}

    	<span class="pull-right">
    		<router-link class="btn btn-primary" v-bind:to="'/updateuser/'+customer._id">
    			编辑
    		</router-link>
    		<button class="btn btn-danger" v-on:click="deleteCustomer(customer._id)">删除</button>
    	</span>
    </h1>
    <ul class="list-group">
    	<li class="list-group-item">
    		<span class="glyphicon glyphicon-asterisk"> 
    			{{customer.tell}}
    		</span>
    	</li>
    	<li class="list-group-item">
    		<span class="glyphicon glyphicon-plus"> 
    			{{customer.email}}
    		</span>
    	</li>
    </ul>

    <ul class="list-group">
    	<li class="list-group-item">
    		<span class="glyphicon glyphicon-asterisk">
    			{{customer.educational}}
    		</span>
    	</li>
    	<li class="list-group-item">
    		<span class="glyphicon glyphicon-plus"> 
    			{{customer.school}}
    		</span>
    	</li>

		<li class="list-group-item">
			<span class="glyphicon glyphicon-asterisk"> 
				{{customer.profession}}
			</span>
		</li>
		<li class="list-group-item">
			<span class="glyphicon glyphicon-plus"> 
				{{customer.describe}}
			</span>
		</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'cumstomerdetails',
  data () {
    return {
      customer:""
    }
  },
  methods:{
  	getCustomer(id){
      this.$http.get("/users/"+id)
          .then((res) => {
			  if(res.data.code === 200){
				  this.customer = res.data.data;
			  }
          })
    },
    deleteCustomer(id){
		this.$confirm("您将要删除此用户", "提示", {
			confirmButtonText: "确定",
			cancelButtonText: "取消",
			type: "warning"
		}).then(() => {
			this.$http.delete("/users/delete/"+id)
				.then((res) => {
					this.$message({
						type:'success',
						message:res.data.msg
					})
				this.$router.push({path:'/'})
			})
		})
    }
  },
  created(){
  	this.getCustomer(this.$route.params.id);
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
